<!DOCTYPE html>
<html class="x-admin-sm">
  
  <head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.2</title>
 <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/static/admin/layuiadmin/style/x-admin_css/font.css">
    <link rel="stylesheet" href="/static/admin/layuiadmin/style/x-admin_css/xadmin.css">
    <script type="text/javascript" src="/static/admin/layuiadmin/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/static/admin/layuiadmin/modules/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  
  <body>
    <div class="layui-fluid">
        <div class="layui-row">
            <form action="" method="post" class="layui-form layui-form-pane">
                <div class="layui-form-item">
                    <label for="name" class="layui-form-label">
                        <span class="x-red">*</span>角色名
                    </label>
                    <div class="layui-input-inline">
                        <input type="text" id="name" name="name" required="" lay-verify="required" value="{$data['name']}"
                        autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">
                        拥有权限
                    </label>
                    <table  class="layui-table layui-input-block">
                        <style type="text/css">
                            .layui-table td, .layui-table th {
                                    min-width: 110px;
                                }
                        </style>
                        <thead>
                            <tr >
                                <th style="text-align: center;"> 栏目</th>
                                <th style="text-align: center;">子栏目</th>
                                <!-- <th style="text-align: center;">权限</th> -->
                            </tr>
                        </thead>
                        <tbody>
                            <!-- 遍历栏目 -->
                          {php}$lan1=$data['zilan'];$lan1keys=array_keys($data['zilan']);{/php}
                           {php}for($i=0;$i<count($lan);$i++){{/php}
                                    <tr>
                                        <td>
                                            <input type="checkbox" {php} if(in_array($lan[$i]['rule_id'],$lan1keys)){echo 'checked';} {/php}  value="{$lan[$i]['rule_id']}" name="lan[{$i}][id]" lay-skin="primary" lay-filter="father" title="{$lan[$i]['rule_name']}-{$lan[$i]['rule_id']}">
                                        </td>
                                    <td>
                                        <div class="layui-input-block">
                                            {php}for($j=0;$j<count($lan[$i]['zilan']);$j++){{/php}
                                                <input name="lan[{$i}][zilan][{$j}][id]" {php} if(in_array($lan[$i]['rule_id'],$lan1keys) && 
                                                in_array($lan[$i]['zilan'][$j]['rule_id'],$lan1[$lan[$i]['rule_id']]) ){echo 'checked';} {/php} lay-skin="primary" type="checkbox" lay-filter="son" value="{$lan[$i]['zilan'][$j]['rule_id']}" title="{$lan[$i]['zilan'][$j]['rule_name']}">  
                                                {php}for($k=0;$k<count($lan[$i]['zilan'][$j]['quan']);$k++){{/php}
                                                <input name="lan[{$i}][zilan][{$j}][quan][{$k}][id]" 
                                                {php} if(in_array($lan[$i]['rule_id'],$lan1keys) && 
                                                in_array($lan[$i]['zilan'][$j]['quan'][$k]['rule_id'],$lan1[$lan[$i]['rule_id']]) ){echo 'checked';} {/php} 
                                                lay-skin="primary" type="checkbox" lay-filter="son" value="{$lan[$i]['zilan'][$j]['quan'][$k]['rule_id']}" title="{$lan[$i]['zilan'][$j]['quan'][$k]['rule_name']}">  
                                                {php}}{/php}
                                                <br>
                                            {php}}{/php}
                                        </div>
                                    </td>
                                    
                                        </tr>
                            {php}}{/php}
                        </tbody>
                    </table>
                </div>
                <div class="layui-form-item layui-form-text">
                    <label for="desc" class="layui-form-label">
                        描述
                    </label>
                    <div class="layui-input-block">
                        <textarea placeholder="请输入内容" id="desc" name="desc" class="layui-textarea"></textarea>
                    </div>
                </div>
                <div class="layui-form-item layui-hide">
                <input type="button" lay-submit lay-filter="LAY-user-front-submit" id="LAY-user-front-submit" value="确认">
              </div>
            </form>
        </div>
    </div>
    <script>
        layui.use(['form','layer'], function(){
            $ = layui.jquery;
          var form = layui.form
          ,layer = layui.layer;
        
          //自定义验证规则
          form.verify({
            nikename: function(value){
              if(value.length < 5){
                return '昵称至少得5个字符啊';
              }
            }
            ,pass: [/(.+){6,12}$/, '密码必须6到12位']
            ,repass: function(value){
                if($('#L_pass').val()!=$('#L_repass').val()){
                    return '两次密码不一致';
                }
            }
          });

          //监听提交
          // form.on('submit(add)', function(data){
          //   console.log(data);
          //   //发异步，把数据提交给php
          //   layer.alert("增加成功", {icon: 6},function () {
          //       // 获得frame索引
          //       var index = parent.layer.getFrameIndex(window.name);
          //       //关闭当前frame
          //       parent.layer.close(index);
          //   });
          //   return false;
          // });


        form.on('checkbox(father)', function(data){

            if(data.elem.checked){
                $(data.elem).parent().siblings('td').find('input').prop("checked", true);
                form.render(); 
            }else{
               $(data.elem).parent().siblings('td').find('input').prop("checked", false);
                form.render();  
            }
        });
        form.on('checkbox(son)', function(data){

            if(data.elem.checked){
                $(data.elem).parent().parent().siblings('td').find('input').prop("checked", true);
                form.render(); 
            }

        });
          
          
        });
    </script>
    <script>var _hmt = _hmt || []; (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
      })();</script>
  </body>

</html>